<!--这是订单详情组件-->
<template>
	<div>
		<p class="filter"></p>
		<div class="addBox"  style="padding-bottom: 40px;">
			<h3 class="fixTitle">
				<span>订单详情</span>
				<p>
					<em style="cursor: pointer;" ><svg-icon icon-class="jian" class="font-size16"/></em><em style="cursor: pointer;"><svg-icon class="font-size16" icon-class="fullScreen" /></em><em style="cursor: pointer;" @click="close"><svg-icon icon-class="cha" class="font-size16" /></em>
				</p>
			</h3>
			<div style="margin: 40px 20px 0;">
				<div style="margin: 20px 0;">
					<p class="title">收货人信息</p>
					<table>
						<tr>
							<td class="leftTd">收货人：</td>
							<td class="rightTd">
								<!-- <el-input v-model="productPrice" clearable placeholder="请输入收货人" style="width: 500px;"></el-input> -->
								{{orderInfo.name}}
							</td>
						</tr>
						<tr>
							<td class="leftTd">地址：</td>
							<td class="rightTd">
								<!-- <el-input v-model="productPrice" clearable placeholder="请输入地址" style="width: 500px;"></el-input> -->
								{{orderInfo.address}}
							</td>
						</tr>
						<tr>
							<td class="leftTd">联系方式：</td>
							<td class="rightTd">
								<!-- <el-input v-model="productPrice" clearable placeholder="请输入联系方式" style="width: 500px;"></el-input> -->
								{{orderInfo.mobile}}
							</td>
						</tr>
						<!-- <tr>
							<td class="leftTd">邮编：</td>
							<td class="rightTd">
								{{orderInfo.postcode}}
							</td>
						</tr> -->
						<tr>
							<td class="leftTd">留言：</td>
							<td class="rightTd">
								{{orderInfo.msg}}
							</td>
						</tr>
						<tr>
							<td class="leftTd">邮箱：</td>
							<td class="rightTd">{{orderInfo.mail}}</td>
						</tr>
					</table>
				</div>
				<div style="margin: 20px 0;">
					<p  class="title">快递信息</p>
					<table>
						<tr>
							<td class="leftTd">承运商：</td>
							<td class="rightTd">
								<!-- <el-input v-model="productPrice" clearable placeholder="请输入承运商" style="width: 500px;"></el-input> -->
								{{orderInfo.shipName}}
							</td>
						</tr>
						<tr>
							<td class="leftTd">邮费：</td>
							<td class="rightTd">
								<!-- <el-input v-model="productPrice" clearable placeholder="请输入邮费" style="width: 500px;"></el-input> -->
								{{orderInfo.postage}}
							</td>
						</tr>
						<tr>
							<td class="leftTd">快递单号：</td>
							<td class="rightTd">
								<!-- <el-input v-model="productPrice" clearable placeholder="请输入快递单号" style="width: 500px;"></el-input> -->
								{{orderInfo.shipNo}}
							</td>
						</tr>
					</table>
				</div>
				<div style="margin: 20px 0;">
					<p  class="title">发票信息</p>
					<table>
						<tr>
							<td class="leftTd">发票抬头：</td>
							<td class="rightTd">
								<!-- <el-input v-model="productPrice" clearable placeholder="请输入发票抬头" style="width: 500px;"></el-input> -->
								{{orderInfo.invoiceTitle}}
							</td>
						</tr>
						<tr>
							<td class="leftTd">发票留言：</td>
							<td class="rightTd">
								<!-- <el-input v-model="productPrice" clearable placeholder="请输入发票留言" style="width: 500px;"></el-input> -->
								{{orderInfo.invoiceMsg}}
							</td>
						</tr>
						<tr>
							<td class="leftTd">发票编码：</td>
							<td class="rightTd">
								{{orderInfo.invoiceCode}}
							</td>
						</tr>
					</table>
				</div>
			</div>
			
			<p style="text-align: center;margin: 30px 0;">
	  			<el-button type="info" @click="close">取消</el-button>
			</p>
		</div>
	</div>
</template>
<script>
  export default {
    props: ['orderInfo'],
    methods: {
      close() {
        this.$emit('hideDetail', false)
      }
    }
  }
</script>
<style scoped>
	p,h3 {margin:0;padding:0}
	h3 em{
		padding: 0 5px;
		font-style: normal;
	}
	h3 em:hover{
		color: #0E90D2;
	}
	.font-size16{
		font-size: 16px;
	}
	.fixTitle{
		width: 800px;
		line-height: 36px;
		padding: 0 10px;
		z-index: 98;
	}
	.addBox {
		width: 800px;
		height: 400px;
		overflow: auto;
		background: #fff;
		position: fixed ;
		left: 25%;
		top: 20%;
		z-index: 101;
	}
	table{
		width: 100%;
		border: 1px solid #eee;
		border-spacing: 0;
		border-collapse: collapse;
		font-size: 12px;
	}
	td{
		border: 1px solid #eee;
		line-height: 46px;
		padding-left: 10px;
	}
	.leftTd{
		width: 30%;
	}
	.rightTd{
		width: 70%;
	}
	.title{
		line-height: 26px;
		font-size: 14px;
	}
</style>
